﻿<!DOCTYPE html>
<!--[if lt IE 9 ]> <html lang="en" dir="ltr" class="no-js ie-old"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" dir="ltr" class="no-js ie9"> <![endif]-->
<!--[if IE 10 ]> <html lang="en" dir="ltr" class="no-js ie10"> <![endif]-->
<!--[if (gt IE 10)|!(IE)]><!-->
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:float="http://www.w3.org/1999/xhtml"
      layout:decorate="~{/layout}">
<!--<![endif]-->
<head>

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- META TAGS                                 -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <meta charset="utf-8">
    <!-- Always force latest IE rendering engine -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- Mobile specific meta -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- PAGE TITLE                                -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <title>FRIDAY | Coupons, Deals, Discounts and Promo codes Template</title>

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- SEO METAS                                 -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <meta name="description" content="FRIDAY is a responsive multipurpose-ecommerce site template allows you to store coupons and promo codes from different brands and create store for deals, discounts, It can be used as coupon website such as groupon.com and also as online store">
    <meta name="	black friday, coupon, coupon codes, coupon theme, coupons, deal news, deals, discounts, ecommerce, friday deals, groupon, promo codes, responsive, shop, store coupons">
    <meta name="robots" content="index, follow">
    <meta name="author" content="CODASTROID">

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- PAGE FAVICON                              -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <link rel="apple-touch-icon" th:href="@{/assets/images/favicon/apple-touch-icon.png}">
    <link rel="icon" th:href="@{/assets/images/favicon/favicon.ico}">

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- GOOGLE FONTS                              -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600" rel="stylesheet">

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- Include CSS Filess                        -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->



    <div th:replace="commons/css/css_header_footer :: public_css1"></div>

</head>

<body id="body" class="wide-layout preloader-active">





    <!--[if lt IE 9]>
        <p class="browserupgrade alert-error">
        	You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.
        </p>
    <![endif]-->

    <noscript>
        <div class="noscript alert-error">
            For full functionality of this site it is necessary to enable JavaScript. Here are the <a href="http://www.enable-javascript.com/" target="_blank">
		 instructions how to enable JavaScript in your web browser</a>.
        </div>
    </noscript>

    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- PRELOADER                                 -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- Preloader -->
    <div id="preloader" class="preloader">
        <div class="loader-cube">
            <div class="loader-cube__item1 loader-cube__item"></div>
            <div class="loader-cube__item2 loader-cube__item"></div>
            <div class="loader-cube__item4 loader-cube__item"></div>
            <div class="loader-cube__item3 loader-cube__item"></div>
        </div>
    </div>
    <!-- End Preloader -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- WRAPPER                                   -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <div id="pageWrapper" class="page-wrapper">
        <!-- –––––––––––––––[ HEADER ]––––––––––––––– -->
        <div th:replace="commons/header::public_header"></div>
        <!-- –––––––––––––––[ HEADER ]––––––––––––––– -->

        <!-- –––––––––––––––[ PAGE CONTENT ]––––––––––––––– -->
        <main id="mainContent" class="main-content">
            <div class="page-container ptb-20">
                <div class="container">
                    <section class="wishlist-area ptb-30">
                        <div class="container">
                            <div class="wishlist-wrapper">
                                <h3 class="h-title mb-40 t-uppercase">愿望单</h3>
                                <table id="cart_list" class="wishlist">
                                    <tbody>
                                        <tr class="panel alert" th:each="goods : ${collectionList}" th:id="'tr_'+${goods.goodsid}">
                                            <td class="col-sm-8 col-md-9">
                                                <div class="media-left is-hidden-sm-down">
                                                    <figure class="product-thumb">
                                                        <img th:src="@{/pictures/}+${goods.path}" alt="product">
                                                    </figure>
                                                </div>
                                                <div class="media-body valign-middle">
                                                    <h5 class="title mb-5 t-uppercase"><a th:href="@{'/detail?goodsid='+${goods.goodsid}}" th:text="${goods.goodsname}"></a></h5>
                                                    <div class="rating mb-10">
                                                        <span class="rating-stars rate-allow" data-rating="2">
				                        		<i class="fa fa-star-o"></i>
				                        		<i class="fa fa-star-o"></i>
				                        		<i class="fa fa-star-o"></i>
				                        		<i class="fa fa-star-o star-active"></i>
				                        		<i class="fa fa-star-o"></i>
				                        	</span>
                                                        <span class="rating-reviews">
				                        		( <span class="rating-count">100</span> rates )
                                                        </span>
                                                    </div>
                                                    <h4 class="price color-green"><span class="price-sale" th:text="'$'+${goods.price}"></span>
                                                        <span th:text="'$'+${goods.price}*${goods.discount}*0.1"></span></h4>
                                                    <button class="btn btn-rounded btn-sm mt-15 is-hidden-sm-up">Add To Cart</button>
                                                </div>
                                            </td>
                                            <td class="col-sm-3 col-md-2 is-hidden-xs-down">
                                                <button class="btn btn-rounded btn-sm" th:onclick="addToCart([[${goods.goodsid}]])">加入购物车</button>
                                            </td>
                                            <td class="col-sm-1">
                                                <button type="button" class="close pr-xs-0 pr-sm-10"  aria-hidden="true" th:onclick="deleteCollection([[${goods.goodsid}]])">
                                                    <i class="fa fa-trash-o"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </section>
                </div>
            </div>


        </main>
        <!-- –––––––––––––––[ END PAGE CONTENT ]––––––––––––––– -->
        <div th:replace="/commons/footer::public_footer"></div>
        <!-- –––––––––––––––[ END FOOTER ]––––––––––––––– -->

    </div>
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- END WRAPPER                               -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->


    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <!-- BACK TO TOP                               -->
    <!-- ––––––––––––––––––––––––––––––––––––––––– -->
    <div id="backTop" class="back-top is-hidden-sm-down">
        <i class="fa fa-angle-up" aria-hidden="true"></i>
    </div>

    <div th:replace="commons/js/js_header_footer :: public_js1"></div>
</body>
<script>

    function addToCart(goodsId) {
            $.ajax({
                url: "/addCart",
                type:"post",
                data: {"goodsId": goodsId},
                success: function (result) {
                    layer.msg(result.msg);
                }
            })
    }

    function deleteCollection(goodsId) {
        $.ajax({
            url: "/collection/deleteCollection",
            type:"post",
            data: {"goodsId": goodsId},
            success: function (result) {
                layer.msg(result.msg);
                $("#tr_"+goodsId).remove();
            }
        })
    }

</script>
</html>
